/*
 * This program is part of the OpenLMIS logistics management information system platform software.
 * Copyright © 2013 VillageReach
 *
 * This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
 *  
 * This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
 * You should have received a copy of the GNU Affero General Public License along with this program.  If not, see http://www.gnu.org/licenses.  For additional information contact info@OpenLMIS.org. 
 */

@heading-green: #17888F;

@import url("mixins.less");
@import url("calendar.less");
@import url("custom-scrollbar.less");

.home-background {
  background: url(../images/home-glow.png) no-repeat center -70px, #d6d6d6 url(../images/home-bg.png) no-repeat right 530px;
}

.home-content {
  padding: 50px;
  font-family: 'HelveticaNeue-CondensedBold', Arial, sans-serif;
  color: #a0a0a0;
  h2 {
    font-size: 3em;
    font-weight: normal;
  }
  h3 {
    font-size: 4.2em;
    font-weight: normal;
    line-height: 65px;
    &.access-denied {
      padding: 16px 0 16px 77px;
      border: 1px solid #aaa;
      border-radius: 4px;
      background: #FFF url('../images/warning.png') no-repeat 14px center;
      font-size: 2em;
      color: #6f6f6f;
      text-shadow: 0 1px 0 #FFF;
      line-height: normal;
    }
  }
}

.innershadow {
  position: relative;
  &:before, &:after {
    width: 100%;
    position: absolute;
    content: attr(title);
    opacity: 0.2;
    color: rgba(255, 255, 255, 1);
  }
  &:before {
    top: 1px;
    left: -1px;
  }
  &:after {
    top: 2px;
    left: 0;
  }
}

.content {
  min-height: 200px;
  padding: 10px 15px 40px;
  margin: 12px 12px 0;
  .box-shadow(0 0 5px rgba(0, 0, 0, 0.6));
  background: white;
  &.rnr-content {
    min-height: 600px;
    padding-bottom: 70px;
  }
  h2 {
    margin-top: 0;
    border-bottom: 1px solid #d6d6d6;
    font-size: 1.4em;
    font-weight: normal;
    color: @heading-green;
  }
}

/* TODO: Split into separate screen */
/* RnR Template config */
.rnr-template-head {
  border: 1px solid #BBB;
  .border-top-radius(3px);
  background: #EEE;
  background: #f9f9f9; /* Old browsers */
  background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
  background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
  font-size: 0.9em;
  font-weight: bold;
  color: #555;
  text-shadow: 0 1px 0 #FFF;
}

.app-form {
  padding: 10px;
  border: 1px solid #e6e6e6;
  .box-shadow(inset 1px 1px 0 white);
  background: #F8F8F8;
}

.form-row {
  padding: 6px 10px;
  margin: 5px 0;
}

.form-row.error {
  background: #FFEAEA;
}

.form-row label {
  margin-bottom: 2px;
  font-size: 0.9em;
}

.form-row input,
.form-row select {
  margin-bottom: 0;
}

.form-row input[type='radio'] {
  margin: -3px 5px 0 0;
}

.form-row input[type='text'] {
  width: 306px;
}

.form-row select {
  width: 320px;
}

.form-row .form-field {
  position: relative;
}

.form-row .form-field .field-error {
  display: block;
  padding-top: 4px;
  font-size: 0.9em;
  color: #E93434;
}

span.field-error {
  display: block;
  padding-top: 4px;
  font-size: 0.9em;
  color: #E93434;
}

.form-row .form-field.radio-group .field-error {
  top: -6px;
  left: 150px;
}

.form-group {
  position: relative;
  padding: 16px 0;
  margin: 20px 0;
  border-top: 1px solid #A0A0A0;
  > h3 {
    display: inline-block;
    position: absolute;
    padding: 0 10px;
    margin-left: 10px;
    background: #F8F8F8;
    top: -23px;
    left: 10px;
    font-size: 1.2em;
    line-height: 24px;
    color: #168e96;
  }
  .form-row {
    padding: 0;
    margin: 6px 0;
    border-bottom: 1px solid #FFF;
    input[type="text"] {
      width: 87%;
      &[ui-date] {
        width: 200px;
      }
    }
    select {
      width: 90%;
    }
  }
  .form-cell {
    width: 42%;
    float: left;
    padding: 6px 10px 10px;
    &.full-width {
      width: 100%;
    }
    &.programs-table {
      width: 70%;
    }
  }
}

.rnr-column-formula {
  font-size: 0.9em;
  line-height: 16px;
  cursor: default;
  color: #888;
  &:hover {
    text-decoration: none;
    color: #888;
  }
}

.label-required {
  font-size: 1.2em;
  font-weight: bold;
  color: #D31717;
}

.form-error {
  font-size: 0.8em;
  color: #E93434;
}

.arithmetic-valid-msg {
  .btn {
    width: 70px;
  }
  strong {
    color: #2063A0;
  }
}

#notifications {
  position: fixed;
  top: 60px;
  left: 265px;
  > div {
    margin: 10px;
    .box-shadow(0 0 6px rgba(0, 0, 0, 0.7));
  }
}

span[class^="tpl-"] {
  display: inline-block;
  padding: 10px;
  vertical-align: text-top;
}

.rnr-template-head span[class^="tpl-"] {
  padding: 8px 10px;
}

.tpl-used {
  width: 18%;
}

.tpl-label {
  width: 35%;
}

.tpl-indicator {
  width: 30px;
}

.tpl-position input {
  width: 20px;
}

.tpl-source {
  width: 18%;
}

.tpl-option {
  select {
    width: 245px;
  }
}

.tpl-visible {
  width: 50px;
  text-align: center;
}

.rnr-template-columns {
  margin-bottom: 10px;
  ul {
    list-style: none;
    margin: 0;
    > li {
      position: relative;
      border: 1px solid #DDD;
      border-top: 0;
      border-color: transparent #BBB #DDD;
      background: #FCFCFC;
      font-size: 0.9em;

      .drag-handle {
        .size(16px, 12px);
        margin-top: -9px;
        position: absolute;
        top: 50%;
        left: 10px;
        background: url("../images/sort-icon.png") no-repeat left center;
        cursor: move;
      }
    }
  }
}

#newRegimenForm {
  padding-top: 20px;
  .form-group {
    padding: 10px 0 0 0;
    margin: 14px 0 0 0;
  }
  .form-cell {
    width: 23%;
    padding: 6px 10px 0px;
    &:last-child {
      padding-top: 32px;
      input[type="checkbox"] {
        margin-top: 0px;
      }
      label {
        display: inline;
        padding-left: 5px;
      }
    }
  }
  #addNewRegimen {
    margin: 5px 0px 5px 10px;
  }
  #addFailMessage {
    margin: 5px 10px 9px 10px;
  }
}

#reportingFields {
  padding-top: 20px;
}

.regimenForm {
  .rnr-template-head {
    .row-fluid {
      padding-top: 8px;
      [class*="span"] {
        min-height: 27px;
      }
      span {
        padding-left: 35px;
      }
    }
  }

  .category-name {
    border-top: 0;
    background: #45a7ad;
    font-size: 0.9em;
    color: white;
    div {
      padding: 2px 10px;
    }
  }
  div[ui-sortable] {
    > div {
      border-bottom: 1px solid #BBB;
    }
  }
  .rnr-template-columns {
    position: relative;
    padding: 10px 0 8px;
    margin-bottom: 0px;
    &:hover {
      background-color: #ececec;
    }
    input[type="text"] {
      margin-bottom: 8px;
    }
    input[type="checkbox"] {
      margin-left: 13px;
    }
    .drag-handle {
      .size(16px, 12px);
      position: absolute;
      top: 33%;
      left: 9px;
      background: url("../images/sort-icon.png") no-repeat left center;
      cursor: move;
    }
    [class*="span"] {
      div:first-child {
        padding-top: 4px;
        padding-left: 7px;
      }
    }

  }
  .regiment-list-items {
    border: 1px solid #BBB;
    border-top: 0 none;
    border-bottom: 0 none;
  }
}

.editable-row {
  background: #ececec;
  .alert {
    padding: 3px 10px;
    margin: 0 33px;
    clear: both;
    font-size: 0.9em;
  }
}

.rnr-tabs {
  margin: 5px 0 20px;
  border-bottom: 2px solid #307579;
  font-size: 0.9em;
  font-weight: bold;
  ul {
    margin: 0;
    float: left;
    list-style: none;
  }
  li {
    margin: 0 3px;
    float: left;
    border-radius: 4px 4px 0 0;
    background: #b8b8b8;
    a {
      display: block;
      padding: 8px 16px 6px;
      text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
      color: #FFF;
      &:hover {
        text-decoration: none;
      }
    }
    &:first-child {
      margin-left: 7px;
    }
    &:hover {
      background: #999;
    }
    &.selected {
      background: #307579;
    }
    &.has-error {
      a {
        padding-left: 33px;
        background-image: url("../images/tab-error.png");
        background-position: 9px center;
        background-repeat: no-repeat;
      }
    }
  }
  span.pull-right {
    margin-left: 5px;
    a {
      font-weight: normal;
    }
  }
  .print-button {
    display: none;
    opacity: 0.0;
  }
}

#sortable .ui-sortable-helper {
  @shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(23, 136, 143, 0.6);
  .box-shadow(@shadow);
  border: 1px solid rgba(23, 136, 143, 0.8);
}

#sortable .sortable-placeholder {
  height: 70px;
  margin: 10px 0;
  border: 2px dashed #5BA5D6;
  background: #E8F8FF;
}

.rnr-template-columns input[type="text"] {
  .size(18px, 70%);
  margin-bottom: 2px;
  font-size: 1em;
}

.rnr-template-columns select {
  margin-bottom: 5px;
}

.rnr-template-columns .col-desc {
  width: 74%;
  display: block;
  padding: 0 0 0 1px;
  font-size: 0.9em;
  line-height: 14px;
  color: #555;
}

.rnr-table {
  .float-left {
    float: left
  }
  .clear-both {
    clear: both
  }
  .left-table, .right-table {
    overflow: auto;
    position: relative;
    table {
      margin-bottom: 0px;
      thead {
        top: 0px;
        th {
          text-align: left;
        }
      }
    }
  }
  .left-table {
    width: 30%;
    max-width: 30%;
    input[type="checkbox"] {
      margin-top: -3px;
    }
  }
  .right-table {
    width: 69.6%;
    max-width: 69.6%;
    border-left: #ccc solid 1px;
  }

  th {
    min-width: 123px;
    padding: 9px 6px 4px;
    font-size: 0.8em;
    font-weight: bold;
    line-height: 14px;
    text-shadow: 0 1px 0 #FFF;
    color: #444;
    background: #EEE;
    background: #f9f9f9; /* Old browsers */
    background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
  }

  .table-bordered th,
  .table-bordered td {
    border-left: none;
    border-right: 1px solid #ddd;
    &:last-child {
      border-right: none;
    }
    .ng-scope {
      display: block;
      position: relative;
    }
  }
  .table-bordered th:first-child,
  .table-bordered td:first-child {
    border-left: 1px solid #ddd;
  }
  td {
    font-family: Verdana, Arial, sans-serif;
  }

  &.regimen-table {
    .col-code {
      min-width: 100px;
    }
    .col-name {
      min-width: 190px;
      padding-left: 6px;
    }
    .col-remarks {
      min-width: 460px;
      input[type="text"].cell-text {
        width: 96%;
        padding: 0px 6px;
      }
    }
    .col-patientsOnTreatment, .col-patientsToInitiateTreatment, .col-patientsStoppedTreatment {
      input[type="text"] {
        width: 91%;
      }
    }
    th {
      width: 90px;
    }
    tbody {
      tr {
        &:last-child {
          td {
            &:first-child {
              padding-left: 7px;
            }
          }
          .cell-text {
            width: 99%;
            padding: 0;
          }
        }
      }
    }
  }
}

.rnr-table td, #facilityApprovedProductTable td, #facilityApprovedProductsModal,
.facility-distribution-form-table td, #productForm, #reportParametersTable,
.refrigerator-form {
  .rnr-form-error {
    min-width: 92px;
    padding: 0px 6px;
    position: absolute;
    bottom: 28px;
    right: -6%;
    border-radius: 10px;
    background: rgba(153, 77, 77, 0.8);
    font-size: 0.7em;
    text-align: center;
    white-space: nowrap;
    color: #FFFFFF;
    z-index: 1;
  }

  .rnr-form-error:after {
    .square(0px);
    position: absolute;
    bottom: -5px;
    right: 12%;
    z-index: 1;
    border-top: 5px solid rgba(153, 77, 77, 0.8);
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    content: "";
  }
  .warning-alert {
    min-width: 100px;
    padding: 1px 9px 1px 28px;
    margin: 0 0 5px;
    display: block;
    position: absolute;
    left: -3px;
    bottom: 28px;
    border-radius: 17px;
    border-color: #e4b863;
    background-image: url(../images/warning_triangle.png);
    background-repeat: no-repeat;
    background-position: 7px center;
    font-size: 0.8em;
    line-height: 1.5;
    white-space: nowrap;
    color: #b38907;
    z-index: 1;

    &:after {
      .square(0px);
      position: absolute;
      bottom: -6px;
      left: 12px;
      z-index: 10;
      border-top: 6px solid #fcf8e3;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      content: "";
    }

    &:before {
      .square(0px);
      position: absolute;
      bottom: -7px;
      left: 11px;
      z-index: 10;
      border-top: 7px solid #b38907;
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      content: "";
    }
  }
  .reasonForRequestedQuantityContainer, .expirationDateContainer {
    .rnr-form-error {
      right: auto;
      left: -6px;
      &:after {
        right: auto;
        left: 11px;
      }
    }
  }
}

.refrigerator-form {
  .rnr-form-error {
    right: 0;
  }
}

.header-fixed {
  position: fixed;
  top: 0px;
  overflow: hidden;
  z-index: 1;
  table {
    padding: 0px;
    margin: 0px;
  }
  th {
    border-radius: 0 !important;
    background: #444;
    text-shadow: none;
    color: white;
  }
}

#header-columns-fixed {
  z-index: 11;
  table {
    width: auto;
  }
}

.column-fixed {
  position: fixed;
  z-index: 10;
  table {
    width: auto;
    box-shadow: #ddd 1px 0px 0px;
  }
}

table .productCategory,
.productCategory {
  padding: 9px 12px 9px 9px;
  background-color: #45a7ad;
  font-size: 12px;
  line-height: 8px;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
  color: #FFF;
  .ngAggregateText {
    left: 12px;
  }
}

input[ui-date] {
  background: #FFF url(../images/calendar-icon.png) no-repeat 98% center;
  cursor: pointer;
  &[disabled] {
    background-color: #EEE;
  }
}

.info-box {
  padding: 9px 12px 2px;
  margin-bottom: 18px;
  .box-shadow(3px 3px 0 rgba(0, 0, 0, 0.2));
  border: 1px solid #B9B9B9;
  background: #F2F2F2;
  font-size: 0.9em;
  text-shadow: 0 1px 0 white;
}

.info-box > table td {
  padding: 4px 20px 10px 0;
}

/* R&R form */

/* Cell size: Small */

/* Cell size: Medium */
/* Cell size: Large */
/*th.col-product,*/
th.col-remarks,
th.col-reasonForRequestedQuantity,
th.col-reasonForLossesAndAdjustments {
  min-width: 280px;
}

td.col-general,
td.col-beginningBalance,
td.col-quantityReceived,
td.col-quantityReturned,
td.col-quantityDispensed,
td.col-newPatientCount,
td.col-stockInHand,
td.col-stockOutDays,
td.col-quantityRequested,
td.col-quantityApproved {
  input[type="text"] {
    width: 89%;
    text-align: right;
  }
}

.col-row-number{
  width: 20px;
}

td.col-expirationDate {
  input[type="text"] {
    width: 89%;
  }
}

td.col-patientsOnTreatment,
td.col-patientsToInitiateTreatment,
td.col-patientsStoppedTreatment {
  input[type="text"] {
    text-align: right;
  }
}

td.col-general,
td.col-beginningBalance,
td.col-total,
td.col-stockInHand,
td.col-normalizedConsumption,
td.col-periodNormalizedConsumption,
td.col-amc,
td.col-maxStockQuantity,
td.col-calculatedOrderQuantity,
td.col-packsToShip,
td.col-price,
td.col-cost,
td.col-lossesAndAdjustments {
  span {
    display: block;
    text-align: right;
  }
  span.row-specific-error {
    span {
      text-align: left;
    }
  }
}

td.col-quantityReceived,
td.col-quantityDispensed,
td.col-newPatientCount,
td.col-stockOutDays,
td.col-quantityRequested,
td.col-patientsOnTreatment,
td.col-patientsToInitiateTreatment,
td.col-patientsStoppedTreatment,
td.col-quantityApproved,
td.col-packsToShip,
td.col-quantityShipped {
  span {
    text-align: right;
    display: block;
  }
}

td.col-remarks {
  input[type="text"] {
    width: 93%;
  }
}

table td.col-formula {
  text-align: center;
}

.col-formula .indicator,
.rnr-template-columns .indicator {
  padding: 0 6px;
  display: inline-block;
  .box-shadow(0px 0px 4px #999);
  border-radius: 26px;
  border: 3px solid white;
  background: #CE5959;
  font-size: 0.7em;
  font-weight: bold;
  color: white;
}

.rnr-template-columns .indicator {
  font-size: 0.8em;
}

.rnr-form-error {
  padding-bottom: 3px;
  font-size: 0.8em;
  color: #E93434;
}

.col-formula .formula {
  min-width: 140px;
  padding-top: 3px;
  margin-top: 6px;
  border-top: 1px dashed #AAA;
  font-style: italic;
  font-size: 0.8em;
  line-height: 15px;
  cursor: pointer;
  color: #249BD3;
}

.col-formula .formula:hover {
  text-decoration: underline;
}

table tr.highlight td {
  border-bottom: 1px solid #3585CF;
  border-top: 1px solid #3585CF;
  background: #ECFAFF;
}

table td.cell-input {
  padding: 0;
  position: relative;
  background-color: #f9f9f9;
  vertical-align: middle;
}

table td.cell-input .cell-text {
  padding: 2px 6px;
  display: inline-block;
  font-size: 0.8em;
  line-height: 18px;
}

table td.cell-input .display-block, .display-block {
  display: block;
}

.cell-input input[type="text"], .cell-input select {
  .size(29px, 96%);
  padding: 0 3px;
  margin: 2px 2px;
  border: 1px solid #BBB;
  border-radius: 0;
  font-size: 0.8em;
}

.cell-input {
  input:focus:required:invalid:focus.ng-pristine,
  textarea:focus:required:invalid:focus.ng-pristine,
  select:focus:required:invalid:focus.ng-pristine,
  input[type='text']:focus {
    .box-shadow(inset 0 0 5px rgba(23, 136, 143, 0.9));
    border-color: #17888f;
  }

}

.search-query {
  margin-top: 10px;
}

.search-box-gap {
  margin-bottom: 10px;
  .search-query {
    margin-top: 0px;
  }
}

.form-tip {
  margin: 3px 0 0 5px;
  font-size: 0.8em;
  color: #666;
}

.search-list {
  position: relative;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin: 10px 0;
  h3 {
    padding: 8px 10px;
    margin: 0;
    background: #f9f9f9; /* Old browsers */
    background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
    line-height: normal;
    text-shadow: 0 1px 0 #FFF;
    color: #444;
  }
  .close-btn {
    .square(16px);
    position: absolute;
    top: 10px;
    right: 11px;
    opacity: 0.8;
    background: url(../images/close-icon.png) no-repeat left top;
    text-indent: -999em;
    &:hover {
      opacity: 1;
    }
  }
  ul {
    margin: 0;
    list-style: none;
    li {
      border-top: 1px solid #CCC;
      &:first-child {
        border-top: 0;
      }
      > a {
        padding: 10px;
        display: block;
        &:hover, &:focus {
          + .user-actions a {
            display: inline-block;
          }
        }
      }
      > span {
        padding: 10px;
        display: block;
      }
      &:hover > a {
        background-color: #f9f9f9;
      }
      &:hover .user-actions a {
        display: inline-block !important;
      }
    }
    .user-actions {
      position: absolute;
      right: 10px;
      top: 0;
      padding: 6px 0;
      display: inline-block;
      a {
        display: none;
        margin-right: 5px;
      }
    }
  }
}

h3 {
  font-size: 1.3em;
}

.adjustments-modal {
  .alert-danger {
    margin: 10px 0 0;
  }
}

.adjustment-field {
  input[type="text"] {
    width: 100px;
    margin-left: 7px;
    border-radius: 4px;
    text-align: right;
  }
  .rnr-form-error {
    padding-right: 5px;
    text-align: right;
  }
  > * {
    margin-right: 10px;
    vertical-align: top;
  }
}

.adjustment-list {
  max-height: 204px;
  margin-top: 10px;
  overflow: auto;
  border: 1px solid #CCC;
  background: #fafafa;
  ul {
    padding: 0;
    margin: 0;
    list-style: none;
    li {
      border-top: 1px solid #eee;
      &:first-child {
        border-top: 0 none;
      }
      .tpl-adjustment-type {
        width: 220px;
        line-height: 26px;
      }
      .tpl-adjustment-qty {
        float: right;
        text-align: right;
        input {
          width: 70px;
          padding-right: 10px;
          margin-bottom: 0;
          border-radius: 3px;
          text-align: right;
        }
      }
      .tpl-adjustment-delete {
        padding-top: 14px;
        float: right;
      }
    }
  }
}

.checkbox-list {
  input[type="checkbox"] {
    margin-top: 8px;
    float: left;
  }
  label {
    padding: 5px 10px;
    float: left;
    cursor: pointer;

  }
  &:hover {
    background: #EEE;
  }
}

.button-row {
  padding: 7px 0;
}

.gradient-header {
  th {
    min-width: 93px;
    background: #EEE;
    background: #f9f9f9; /* Old browsers */
    background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
    font-size: 0.9em;
    font-weight: bold;
    text-shadow: 0 1px 0 #FFF;
    color: #444;
  }
}

.total-cost {
  border-radius: 0;
  font-size: 1.1em;
  font-weight: bold;
}

.budget-exceeded-icon {
  position: relative;
  color: #CE8726;
  &:hover #budgetWarningMessage {
    display: block;
  }
}

#budgetWarningMessage {
  display: none;
}

.warning-alert {
  padding: 1px 8px 1px 27px;
  margin: 0 0 5px;
  display: block;
  border-radius: 0;
  background-image: url(../images/warning_triangle.png);
  background-repeat: no-repeat;
  background-position: 5px center;
  font-size: 0.9em;
}

.rnr-adjustment {
  padding: 0 6px;
  display: block;
  font-size: 0.85em;
  line-height: 28px;
  text-align: right;
  background: url(../images/edit-icon.png) no-repeat 8px center;
  .adjustment-value {
    font-weight: bold;
  }
}

.adjustment-total {
  padding: 10px 52px 10px 10px;
  margin: 10px 0 0;
  border-radius: 0;
  border-color: #F0D29F;
  font-size: 1.2em;
  font-weight: bold;
  text-align: right;
}

//Schedules

.list-header-container {
  border: 1px solid #CCC;
  border-radius: 5px 5px 0px 0px;
  background: #f9f9f9; /* Old browsers */
  background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
  background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
}

.list-header {
  font-size: 0.9em;
  font-weight: bold;
  text-shadow: 0 1px 0 #FFF;
  color: #444;

  div {
    display: inline-block;
    line-height: 40px;
  }
  .first-column {
    padding-left: 20px;
    display: block;
    white-space: nowrap;
  }
}

.list-container {
  border: 1px solid #CCC;
  border-top: 0;
}

.list-row {
  padding: 12px 0;
  border-bottom: 1px solid #EEE;
  input[type="text"] {
    width: 76%;
  }
  .first-column {
    padding-left: 20px;
    display: block;
    &.checkbox-column {
      padding-left: 30px;
    }
  }
  div:last-child input[type="button"] {
    margin-right: 12px;
    float: right;
  }
  &:hover {
    background-color: #F9F9F9;
  }
  input[type="button"] {
    margin-left: 20px;
  }
}

.program-isa {
  padding-top: 10px;
  .span1 label {
    padding-top: 4px;
  }
}

.product-isa {
  .span2 label {
    padding-top: 22px;
  }
}

.schedule-form,
.edit-schedule-form {
  margin: 0;
  .save-row-active {
    border-style: solid;
    border-width: 1px;
    input {
      margin: 0;
    }
    .list-row {
      padding: 16px 0;
      border: 0 none;
    }
    .save-cancel-row {
      padding: 8px 0;
      div {
        min-height: 20px;
      }
    }
  }
  .form-error {
    line-height: 24px;
  }
}

.save-row-active {
  border-color: #17b4c2 #dfdfdf;
  background-color: #e1f5f8;
}

.save-cancel-row {
  background-color: #c7e5e7;
}

.edit-schedule-form {
  .save-row-active {
    border-color: #949494 #dfdfdf;
    background-color: #f8f8f8;
    .save-cancel-row {
      background-color: #ebebeb;
    }
  }
}

.period-table {
  thead {
    border-radius: 5px 5px 0px 0px;
    th {
      background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%);
      padding: 11px 10px;
      font-size: 0.9em;
      font-weight: bold;
      text-shadow: 0 1px 0 #FFF;
    }
  }
  tr {
    &:hover {
      background-color: #F9F9F9;
    }
    td {
      padding: 16px 10px;
    }
    td.col-total-days, td.col-number-of-months, td.col-delete-button {
      text-align: right;
    }
  }
  .col-number-of-months, .col-total-days, .col-delete-button {
    max-width: 40px;
    min-width: 40px;
  }
  .col-period-name, .col-description {
    max-width: 150px;
  }
  .col-start-date, .col-end-date {
    max-width: 100px;
  }
}

input.required-error, textarea.required-error {
  border-color: #E9322D !important;
  &:focus {
    .box-shadow(0 0 6px #F8B9B7);
  }
}

input.warning-error {
  border-color: #9e811d !important;
  background-color: #feffe1;
  &:focus {
    .box-shadow(0 0 6px #F8B9B7);
  }
}

input[type='text'] {
  outline: 0 none !important;
}

.row-fluid [class*="span"] {
  word-wrap: break-word;
}

input:focus:required:invalid:focus.ng-pristine,
textarea:focus:required:invalid:focus.ng-pristine,
select:focus:required:invalid:focus.ng-pristine {
  @shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(23, 136, 143, 0.6);
  .box-shadow(@shadow);
  border-color: rgba(23, 136, 143, 0.8);
  color: #555;
}

@-webkit-keyframes highlight {
  0% {
    background: transparent;
  }
  10% {
    background: #FFFFD3;
  }
  50% {
    background: #FFFFD3;
  }
  100% {
    background: transparent;
  }
}

@-moz-keyframes highlight {
  0% {
    background: transparent;
  }
  10% {
    background: #FFFFD3;
  }
  50% {
    background: #FFFFD3;
  }
  100% {
    background: transparent;
  }
}

.updated-item {
  -webkit-animation-name: highlight;
  -webkit-animation-duration: 3s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-iteration-count: 1;
  -moz-animation-name: highlight;
  -moz-animation-duration: 3s;
  -moz-animation-timing-function: ease;
  -moz-animation-iteration-count: 1;
}

table td.delete-button {
  text-align: center;
}

.cell-error-highlight {
  display: block;
  position: relative;
  background: #FFEFEF;
  color: #CF2323;
  input[type='text'] {
    border: 1px solid #E22B2B;
    background-color: transparent !important;
    color: #CF2323;
    &:focus {
      .box-shadow(none);
      border: 1px solid #E22B2B;
    }
  }
  &:hover {
    .row-specific-error {
      display: block !important;
    }
  }
}

.row-error-highlight {
  td {
    border-top: 2px solid #E28E8E;
    border-bottom: 2px solid #E28E8E;
    background-color: #FCDFDF !important;
  }
}

.row-specific-error {
  width: 109%;
  max-width: 160px;
  padding: 6px;
  margin-left: -82px;
  display: none;
  position: absolute;
  bottom: 36px;
  left: 50%;
  .box-shadow(2px 2px 5px rgba(0, 0, 0, 0.2));
  z-index: 10;
  border: 2px solid #E43D3D;
  border-radius: 6px;
  background: #FFF !important;
  font-size: 0.8em;
  line-height: 13px;
  color: #CF2323;
  .beak-down {
    .square(0px);
    position: absolute;
    bottom: -9px;
    left: 46%;
    border-top: 8px solid #E22F2F;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
  }
}

.gridStyle {
  .size(400px, 100%);
  border: 1px solid rgb(212, 212, 212);
}

.approveGrid {
  width: 100%;
  max-height: 1320px;
  min-height: 333px;
  margin-top: 10px;
  border: 1px solid rgb(212, 212, 212);
}

.roleGrid {
  .size(200px, 100%);
  border: 1px solid rgb(212, 212, 212);
}

.grid-filters {
  padding: 10px 0 20px;
  text-align: right;
  .search-query {
    width: 140px;
    padding: 4px 6px;
    margin-top: 0;
  }
  select {
    width: 170px;
    margin: 0 0 0 8px;
  }
  #searchProduct {
    width: 85%;
    margin-right: 0px;
    float: right;
  }
}

.search-in-category {
  margin-bottom: 10px;
  .dropdown-menu {
    text-align: left;
  }
  .btn-group {
    display: inline-block;
  }
}

#searchControl {
  .search-in-category {
    margin-bottom: 0;
  }
  input {
    .border-right-radius(3px);
  }
}

.autosuggest-input {
  position: relative;
  .search-list {
    width: 501px;
    position: absolute;
    top: 19px;
    left: 0;
    .box-shadow(1px 2px 3px rgba(0, 0, 0, 0.1));
    z-index: 1;
    border-radius: 0 0 3px 3px;
    background: white;
    font-size: 0.9em;
    li {
      border: 0;
      &:hover {
        a {
          background-color: rgb(218, 218, 218);
          text-decoration: none;
        }
      }
      a {
        padding: 6px 10px;
        color: #444;
      }
    }
  }
}

.editBtn {
  position: relative;
  top: 4px;
  left: 700px;
}

.init-rnr {
  label {
    margin: 0;
    vertical-align: text-top;
  }
  input[type='radio'] {
    margin: 0;
  }
}

.init-rnr-grid {
  .gridStyle {
    width: 720px;
  }
  .ngCell input {
    width: 80%;
  }
  margin: 20px 0;
}

.suggest-field {
  .size(20px, 87%);
  padding: 4px 6px;
  position: relative;
  .box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.075));
  border: 1px solid #CCC;
  border-radius: 4px;
  background-color: #FFF;
  input[type="text"] {
    .size(20px, 100%);
    padding: 0;
    .box-shadow(none);
    border: 0 none;
    border-radius: 0;
    background-color: transparent;
    &:focus {
      .box-shadow(none) !important;
      border-color: transparent !important;
    }
  }
  .clear-search {
    .square(20px);
    display: block;
    position: absolute;
    top: 4px;
    right: 4px;
    opacity: 0.8;
    background: url(../images/clear-search-icon.png) no-repeat center center;
    text-indent: -999em;
  }
  &:hover {
    .clear-search {
      opacity: 1;
    }
  }
}

//grid styles

.ngGrid {
  border-radius: 4px;
  background-color: transparent;
  font-size: 0.9em;
}

.ngCell {
  z-index: auto !important;
  overflow: visible;
  input {
    width: 88%;
  }
  .orderStatusCellText {
    overflow: visible;
  }
}

.ngCellText.checked {
  padding-left: 20px;
  font-size: 1.2em;
}

.ngTopPanel {
  background-color: transparent;
}

.ngHeaderContainer {
  background-color: #f8f8f8
}

.ngHeaderSortColumn[style*='pointer'] {
  background: url(../images/sortable.png) no-repeat right 12px;
}

.ngSortButtonDown, .ngSortButtonUp {
  .size(5px, 20px);
  top: 12px;
  right: 10px;
  left: auto;
  border: 0;
}

.ngSortButtonDown {
  background: url(../images/sort-down.png) no-repeat left top;
}

.ngSortButtonUp {
  background: url(../images/sort-up.png) no-repeat left top;
}

.ngViewport {
  outline: 0 none;
}

.grid-btn {
  margin: 2px 10px;
}

.rnr-approval {
  .rnr-adjustment {
    background-image: none;
    text-align: left;
  }
}

.user-program {
  padding: 10px;
}

.user-list li {
  position: relative;
  &.user-disabled {
    .user-username,
    .user-name {
      color: #888;
    }
  }
}

.user-name {
  font-weight: bold;
}

.user-username {
  color: #666;
}

td .close {
  display: block;
  float: none;
  text-align: center;
}

.prog-role-grid {
  .fluid-grid {
    border-radius: 3px 3px 0 0;
  }
  .row-fluid {
    border-top: 1px solid #DDD;
    &:first-child {
      border-top: 0 none;
    }
  }
  .field-error {
    padding-top: 2px;
    display: block;
    font-size: 0.9em;
    color: #E93434;
  }
  .add-role-row {
    padding: 15px 10px 10px;
    border: 1px solid #DDD;
    border-top: 0 none;
    border-radius: 0 0 3px 3px;
    background-color: #e0e0e0;
    .fluid-grid-cell {
      padding: 0;
    }
    .select2-roles {
      .fluid-grid-cell {
        padding: 0 4px;
      }
    }
    &.supervisory-roles {
      .select2-roles {
        .fluid-grid-cell {
          padding: 0 5px 0 9px;
        }
      }
    }
    select {
      width: 100%;
      margin-bottom: 0;
      &[multiple] {
        width: auto;
      }
    }
  }
}

.fluid-grid {
  border: 1px solid #DDD;
  border-radius: 3px;
}

.fluid-grid-header {
  font-weight: bold;
}

.fluid-grid-cell {
  padding: 10px;
}

.non-full-heading {
  padding: 4px 7px;
  margin: 0;
  background: #EEE;
  font-size: 1em;
}

.delete-role {
  margin: 10px 0 0 -5px;
}

.select2-results {
  .select2-highlighted {
    background: #61acaf;
    .status-icon {
      .box-shadow(0px 0px 1px 1px whitesmoke);
    }
  }
}

.row-fluid [class*="span"].select2-container {
  margin-left: 0;
  &.bottom-spacer {
    margin-bottom: 15px;
  }
}

.select2-container-active {
  .select2-choice,
  .select2-choices {
    border-color: #17888f;
  }
}

.select2-container-multi {
  &.select2-container-active .select2-choices {
    border-color: @heading-green;
  }
  .select2-choices {
    li {
      float: none;
      &.select2-search-choice {
        padding: 3px 20px 3px 5px;
        margin-right: 4px;

      }
    }
    .select2-search-field input {
      font-size: 0.9em;
      font-weight: bold;
      color: @heading-green !important;
    }
  }
  .select2-search-choice-close {
    top: 3px;
    left: auto;
  }
}

.add-supported-program-row {
  background-color: #efefef;
}

.grid-input-row-grey{
  background-color: #efefef;
}
.input-adjusted {
  height:28px !important;
}

.loader-icon {
  .square(100%);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background: transparent url('../images/loader.gif') 50% 50% no-repeat;
}

.view-req-form {
  padding: 10px 15px;
  .row-fluid {
    padding: 4px 0 8px;
    .select2-container {
      width: 80%;
    }
    &.date-range {
      padding-top: 7px;
      label {
        display: inline;
      }
      input {
        width: 50%;
      }
    }
  }
}

input[placeholder].placeholder {
  color: #a2a2a2;
}

#viewReqList, #approveReqList {
  .ngRow.odd:hover, .ngRow.odd:hover + .ngRow.odd {
    background-color: #bdd0cb;
  }
  .ngRow.even:hover, .ngRow.even:hover + .ngRow.even {
    background-color: #bdd0cb;
  }
  .ngCellText {
    span {
      cursor: pointer !important;
    }
  }
}

.orderNumber {
  white-space: pre;
}

.content .pagination {
  margin-bottom: 30px;
  ul {
    float: right;
    .box-shadow(none);
  }
  li {
    a {
      padding: 3px 9px;
      margin-right: 5px;
      .box-shadow(inset 0 0 2px white);
      border-radius: 5px;
      border: 1px solid #b9b9b9;
      background: #e7e7e7;
      line-height: 20px;
      color: #777;
    }
    &.errorPage {
      a {
        border-color: rgb(221, 42, 42);
        background-color: red;
        color: #ffffff;
      }
    }

    &.active {
      a {
        border-color: #419EA2;
        background-color: #60ACAF;
        color: #E1EDED;
      }
    }

    &.disabled {
      a {
        color: #CCC;
        &:hover {
          background-color: #e7e7e7;
        }
      }
    }
  }
}

#overrideIsaModal,
#programProductISA {
  width: 1000px;
  margin-top: -260px;
  margin-left: -500px;
  label {
    text-align: right;
  }
  .ISAFormulaModalSubContent {
    h5 {
      margin-bottom: 0px;
    }
  }
  .modal-body {
    max-height: 500px;
    padding-top: 5px;
    form {
      margin: 0 0 10px;
    }
    input[type="text"] {
      padding: 4px 6px;
    }
    .label {
      font-size: 1.1em;
    }
  }
  .calculatedAmount {
    padding: 5px 10px;
    border: 1px solid rgb(218, 218, 218);
    background-color: rgb(247, 247, 247);
    color: #777;
    input[type="text"] {
      width: 90px;
      margin: 0px 2px;
    }
  }
  #monthlyRestockAmount {
    padding: 10px 10px;
    font-size: 1.2em;
  }
  #ISA-population {
    border-color: #dac73b;
    background-color: #f8f3ce;
    color: #a5990d;
  }
  .modal-footer #saveFailMessage {
    display: none;
  }
  .form-error {
    margin: -6px 0 8px 0;
    display: none;
  }
}

#programProductISA {
  input[type="text"] {
    text-align: right;
  }
}

#nonFullSupplyProductsModal, #facilityApprovedProductsModal {
  width: 980px;
  margin-left: -490px;
  label {
    font-size: 1em;
  }
  .modal-body {
    font-size: 0.9em;
  }
  hr {
    margin: 3px 0 10px;
  }
  .modal-footer {
    text-align: left;
  }
  .select2-default {
    color: #555 !important;
  }
}

.product-list {
  max-height: 175px;
  overflow: auto;
  border: 1px solid #CCC;
  background: #FAFAFA;
  > .row-fluid {
    border-bottom: 1px solid #EEE;
    input[type='text'] {
      width: 100%;
      margin-bottom: 0;
    }
    .delete-role {
      margin-top: 5px;
      font-size: 1.8em;
    }
  }
}

.product-list-header {
  span, label {
    margin-bottom: 0;
    font-weight: bold;
    line-height: 16px;
  }
  border-bottom: 1px solid #ccc !important;
}

.page-errors {
  padding: 7px 30px;
  margin-top: 10px;
  border: 1px solid #ff5656;
  background: #FFEBEB url(../images/tab-error.png) no-repeat 8px center;

  .dropdown {
    display: inline-block;
  }

  .dropdown-toggle {
    padding-right: 18px;
    display: inline-block;
    background: url(../images/errordownarrow.png) no-repeat right 8px;
    font-size: 0.8em;
    font-weight: bold;
    text-decoration: none;
    color: #CA0000;
  }
  .open .dropdown-toggle {
    background: url(../images/errordownarrow.png) no-repeat right -8px;
  }
  .dropdown-menu {
    width: 60px;
    min-width: 60px;
    min-width: auto;
    padding: 0;
    right: 0;
    left: auto;
    .box-shadow(none);
    border: 1px solid #ff5656;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.9);
    font-size: 0.8em;
    text-align: right;
    li {
      line-height: normal;
      a {
        padding: 3px 10px;
        font-weight: bold;
        color: #CA0000;
        &:hover {
          background: rgb(231, 66, 66);
          color: #FFF;
        }
      }
    }
  }
}

.roles-form,
.reports-form {
  .row-fluid {
    padding-bottom: 20px;
    input[type='text'] {
      width: 96%;
      margin: 0;
    }
    .field-error {
      font-size: 0.8em;
    }
    .form-inline {
      width: 88%;
      min-height: 32px;
      padding-left: 35px;
      margin: 5px 5px 0;
      background: url('../images/radio-big-default.png') no-repeat;
    }
    .radio-group {
      width: 360px;
      padding: 12px 18px;
      margin-top: 10px;
      border: 1px solid #CCC;
      border-radius: 5px;
      background: #FFF;
      font-size: 0.9em;
      * {
        margin: 0;
        vertical-align: middle;
      }

      label {
        padding-left: 5px;
        font-size: 1em;
        cursor: pointer;
      }
    }
  }
  .roles-note {
    font-size: 0.9em;
    font-style: italic;
    color: #666;
  }
  .role-mixed-warning {
    padding-bottom: 8px;
    .roles-note {
      font-style: normal;
    }
  }
}

.is-disabled {
  color: #999;
}

.is-selected {
  background: url('../images/radio-big-checked.png') no-repeat !important;
}

#rightsTable {
  th {
    vertical-align: top;
  }
}

.rights-table {
  tr {
    th, td {
      width: 16.66%;
      padding: 20px 9px 20px 20px;
      background-color: white;
    }
    &:first-child {
      th {
        padding: 2px;
        cursor: pointer;
        &:hover {
          position: relative;
          .box-shadow(0 3px 3px rgba(0, 0, 0, 0.2));
        }
        label {
          padding: 2px 3px;
        }
        h4 {
          margin: 4px 0;
          font-size: 1.2em;
          color: #666;
        }
        * {
          cursor: pointer;
        }
      }
    }
    .checkbox-list {
      label {
        width: 80%;
        display: block;
      }
    }
    .is-disabled {
      * {
        cursor: default;
      }
      background: #f8f8f8;
      .checkbox-list {
        &:hover {
          background: #f8f8f8;
        }
      }
    }
  }
}

.configure-program-table {
  width: 50%;
}

.cancel-button {
  margin-top: 4px;
  margin-left: 10px;
  float: left;
}

.note {
  padding: 8px 0 0;
  font-size: 0.9em;
  font-style: italic;
  color: #666666;
}

#overrideIsaTable {
  margin: 5px;
  input[type="text"] {
    margin-bottom: 0;
    text-align: right;
  }
  div {
    .list-row {
      &:hover {
        background-color: transparent;
      }
    }
  }

  .list-container {
    height: 300px;
    overflow: auto;
  }

  .use-calculated-isa-column {
    min-width: 140px;
  }
}

#searchProduct.search-query {
  margin-bottom: 8px;
}

.geo-zone-facility-list {
  h3 {
    margin: 3px 0;
    font-weight: normal;
    color: #48888f;
  }
}

.facilities-isa-amount-table {
  overflow: auto;
  tr {
    th {
      background: #f9f9f9;
      background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
      background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
      background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
      font-size: 0.9em;
      text-shadow: 0 1px 0 white;
    }
    &:last-child {
      th {
        border-top: 1px solid #ececec;
        border-left: 1px solid #ececec;
        background: #e0e0e0;
        &:first-child {
          border-left: 1px solid #ddd;
        }
      }
    }
    td {
      text-align: right;
      &:first-child {
        text-align: left;
      }
    }

    &:last-child {
      td {
        background: #d6f5f8 !important;
        font-weight: bold;
      }
    }
  }
  .main-heading {
    text-align: center;
  }

}

.manage-distribution, .distribution-grid {
  .distribution-section {
    margin-bottom: 20px;
  }
  .delivery-zone {
    padding-left: 12px;
  }
}

#changePassword {
  .row-fluid [class*="span"] {
    min-height: 75px;
  }
  form {
    margin-bottom: 0;

    #passwordRules {
      padding: 1em;
    }
  }
}

.include-header-form {
  input, label {
    margin: 2px 0 0;
    vertical-align: text-top;
  }
  input {
    margin: 6px 2px 0 0;
  }
}

.add-new-row-button {
  margin-top: 6px;
  font-weight: bold;
  text-shadow: 0 1px 0 #FFF;
  a {
    font-size: 1.2em;
    color: #666;
    background-color: #d6d6d6;
    padding: 12px 0;
    text-align: center;
    display: block;
    &:hover {
      background-color: #CCC;
      text-decoration: none;
      color: #555;
    }
  }
}

.remove-row {
  color: indianred;
  font-weight: bold;
  font-size: 2.4em;
  &:hover {
    color: darkred;
    text-decoration: none;
  }
}

.custom-tooltip {
  position: relative;
  .custom-tooltip-msg {
    position: absolute;
    display: none;
    top: -5px;
    left: 19px;
    min-width: 100px;
    text-align: center;
    color: #FFF;
    text-decoration: none;
    font-size: 0.8em;
    border-radius: 3px;
    padding: 2px 4px;
    background-color: rgba(0, 0, 0, 0.7);
  }
  &:hover .custom-tooltip-msg {
    display: block;
    z-index: 10;
  }
  .custom-tooltip-msg:after {
    content: "";
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    top: 6px;
    left: -8px;
    border-right: 8px solid rgba(0, 0, 0, 0.7);
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: none;
  }
}

.shipment-error {
  .icon-warning-sign {
    color: darkred;
  }
}

.select2-drop-mask {
  max-width: 100%;
  max-height: 100%;
}

.emergency-icon {
  max-width: 110px;
  border: 1px solid red;
  .ngHeaderSortColumn {
    width: 100%;
  }
}

input[rnr-validator="positiveInteger"] {
  text-align: right;
}

.cell-input {
  input[type="text"].small-width-ie {
    width: 86%;
  }
}

.padding2px {
  padding: 2px;
}

#requisition-head-block {
  padding: 8px 0px 0px
}

.regular {
  .right-arrow(#DBDBDB);
}

.regular:after, .regular:before {
  .right-arrow-after-before();
}

.regular:after {
  .right-arrow-after(#DBDBDB);
}

.emergency {
  .right-arrow(#D25F5B);
  color: #fff;
}

.emergency:after, .emergency:before {
  .right-arrow-after-before();
}

.emergency:after {
  .right-arrow-after(#D25F5B);
}

.pull-left.requisition-head-block {
  width: 90%;
  margin-left: 0.4%;
}

@media screen and (min-width: 1024px) {
  .pull-left.requisition-head-block {
    width: 90.5%;
  }
}

@media screen and (min-width: 1100px) {
  .pull-left.requisition-head-block {
    width: 88%;
  }
}

@media screen and (min-width: 1020px) {
  .pull-left.requisition-head-block {
    width: 87%;
  }
}

@media screen and (min-width: 960px) {
  .pull-left.requisition-head-block {
    width: 86%;
  }
}

@media screen and (min-width: 840px) {
  .pull-left.requisition-head-block {
    width: 84%;
  }
}

@media screen and (min-width: 648px) {
  .pull-left.requisition-head-block {
    width: 82%;
  }
}

@media screen and (max-width: 1050px) {
  .regular {
    padding: 29px 15px;
  }

  .regular:after {
    border-width: 39px 0 39px 15px;
    margin-top: -39px;
  }

  .emergency {
    padding: 29px 15px;
  }

  .emergency:after {
    border-width: 39px 0 39px 15px;
    margin-top: -39px;
  }
}

.rnr-table {
  overflow: auto;
  padding-top: 10px;
  th.col-productCode, td.col-productCode {
    min-width: 75px;
    width: 75px;
  }
  th.col-product, td.col-product {
    min-width: 250px;
  }
  th.col-skipped, td.col-skipped {
    min-width: 55px;
    width: 60px;
  }
  th.col-skipped {
    span.skipped-checkbox {
      display: inline-block;
      margin-right: 5px;
    }
  }
  td.col-skipped {
    input[type="checkbox"][id^="skip_"] {
      margin-left: 40%;
    }
  }
}

#podForm {
  .pagination {
    margin-bottom: 130px;
  }
  .action-buttons {
    z-index: 6;
  }
}

#pod {
  .col-fullSupply {
    min-width: 50px;
    width: 75px;
  }
  .col-packsToShip, .col-quantityShipped {
    width: 150px;
  }
  .col-productName {
    width: 482px;
    min-width: 250px;
  }
  .col-quantityReceived .col-quantityReturned {
    width: 150px;
    input {
      width: 90%;
    }
  }
  .col-notes {
    width: 300px;
  }
  .col-remarks {
    width: 90%;
  }
}

#podFooter {
  position: absolute;
  bottom: 48px;
  left: 15px;
  strong {
    display: block;
  }
  input {
    width: 80%;
    height: 20px;
    padding: 4px 6px;
    margin-bottom: 9px;
    font-size: 1em;
    margin-left: 0px;
  }
}

.resultCountHeader {
  th {
    padding: 0;
    font-size: 14px;
  }
}

table.search-list {
  border: 1px solid #ddd;
  border-left: 0;
}

.clear-top {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}

.clear-bottom {
  padding-bottom: 0;
  margin-bottom: 0;
}

.input-div {
  height: 20px;
  padding: 4px 6px;
  border: 1px solid #ccc;
  border-radius: 3px;
  background: #fff;
  .box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.075));
  font-size: 14px;
  line-height: 20px;
  color: #555;
  cursor: default;
}

div.input-div[disabled] {
  background: #eee;
  a[disabled] i {
    color: #333;
    &:hover {
      cursor: not-allowed;
    }
  }
  &:hover {
    cursor: not-allowed;
  }
}

.associate-facility.input-div {
  .size(28px, 88.5%);
  padding: 0;
  &:hover {
    cursor: pointer;
  }
  .facility-associated {
    padding: 4px 6px;
    float: left;
    .placeholder {
      color: #999;
    }
  }
  .btn {
    padding: 4px 11px;
    float: right;
    border: 0;
    border-left: 1px solid #bbb;
    .border-left-radius(0);
  }
  .icon-ellipsis-horizontal {
    color: #777;
  }
}

.slider {
  display: none;
}

.separator {
  height: 100%;
  border-left: 1px solid #ccc;
  position: absolute;
  margin-left: 48%;
}

.searchAndFilter {
  width: 98%;
  margin: 0 11px 0 10px;
  background: white;
  border: 1px solid #ccc;
  .box-shadow(0 0 7px rgba(0, 0, 0, 0.25));

  .search-list {
    margin-bottom: 0;
    ul {
      height: 282px;
      overflow-y: auto;
      li {
        &:last-child {
          border-bottom: 1px solid #CCC;
        }
      }
    }
  }
  .main-heading {
    background: white;
  }
  #searchFacility {
    width: 150%;
  }
  #searchGeoZone {
    width: 57%;
  }
  #search, #searchMultipleFacilities {
    width: 68%;
    padding: 4px 1.5% 22px;
  }
  .separator {
    margin-left: 71%;
  }
  #filter {
    width: 26%;
    padding: 4px 1.5% 22px;
    label {
      font-size: 0.9em;
    }
    .selected-text {
      margin-left: 8px;
      a {
        margin-left: 3px;
        text-decoration: underline;
      }
    }
    #setFiltersModal {
      width: 640px;
      margin: -280px 0 0 -320px;
      overflow-x: hidden;
      .section-divider {
        margin-bottom: 15px;
        border-bottom: 1px solid #ddd;
        padding-bottom: 6px;
      }
    }
  }
  .row-fluid {
    border-top: 0;
  }
}

.searchAndFilter:after, .slider-beak:after {
  .square(0px);
  position: absolute;
  border-bottom: 16px solid white;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  content: "";
  top: -15px;
  left: 267px;
  z-index: 10;
}

.searchAndFilter:before, .slider-beak:before {
  .square(0px);
  position: absolute;
  border-bottom: 17px solid #bbb;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  content: "";
  top: -16px;
  left: 266px;
}

.select-result-container {
  vertical-align: super;
  padding: 3px 5px 3px 6px;
  line-height: 10px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);

  .select-result-close {
    .icon-remove {
      color: #858585;
    }
    &:hover {
      text-decoration: none;
      .icon-remove {
        color: #444;
      }
    }
  }
}

.bottom-padding {
  padding-bottom: 20px !important;
}

input[type="checkbox"].facilityCheckbox {
  margin-top: 0;
  vertical-align: middle;
  margin-right: 6px;
}

#addMembers {
  margin-bottom: 20px;
}

#multipleSearchAndFilter {
  margin: 0 0 20px;
  width: 100%;
  &:before {
    left: 21px;
  }
  &:after {
    left: 22px;
  }
}

#clearProductSearch {
  margin-left: 10px;
  border-radius: 3px !important;
}

#facilityApprovedProductsModal {
  margin-top: -250px;
  margin-left: -425px;
  max-width: 950px;
  .modal-body {
    max-height: 500px;
  }
  .product-list {
    border-radius: 3px;
    max-height: 225px;
    .productCategory {
      padding: 0;
    }
    .fluid-grid-cell {
      padding: 7px 10px;
    }
    input[type="text"] {
      padding: 2px 6px;
    }
  }
}

.option-header {
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  .select2-result-label {
    cursor: default;
  }
}

.program-schedules-btn {
  margin: 7px 10px 0 0px;
}

#programSchedulesTable {
  min-width: 1200px;

  .searchAndFilter {
    &:after, &:before {
      display: none;
    }
  }
  .slider-beak:after {
    top: 34px;
    left: 21px;
  }
  .slider-beak:before {
    top: 33px;
    left: 20px;
  }
  .associate-facility.input-div {
    width: 100%;
    .facility-associated {
      max-width: 75%;
    }
  }
  .clear-search {
    right: 38px;
  }
  select {
    margin-bottom: 0;
  }
}

.add-program-schedule {
  background: #e0e0e0;
  border-radius: 0 0 3px 3px;
  #addNewRow {
    margin: 0 0 10px;
  }
}

.program-schedules-add-new-btn {
  margin: 12px 10px 0 0px;
}

.slider-row-fluid {
  .slider {
    margin: 10px 0;
  }
}

.table-container {
  overflow: auto;
  table {
    max-width: 100%;
    word-wrap: break-word;
  }
}

.col-icon-ok {
  max-width: 50px;
  min-width: 50px;
}

.col-name {
  min-width: 250px;
}

#facilityApprovedProductTable {
  th, td {
    line-height: 15px;
  }
  .col-full-supply {
    max-width: 50px;
    min-width: 50px;
  }
  .col-product-code {
    min-width: 100px;
    max-width: 125px;
  }
  .col-strength, .col-unit-measure {
    min-width: 80px;
    max-width: 100px;
  }
  .col-action {
    min-width: 125px;
  }
  .col-max-months-stock, .col-min-months-stock, .col-eop {
    min-width: 60px;
    max-width: 125px;
    input[type="text"] {
      margin-bottom: 0;
      width: 85%;
    }
  }
  td .rnr-form-error {
    bottom: 22px;
    line-height: 20px;
  }
  .toolbar-error {
    color: #CA0000;
  }
  input.btn-danger {
    margin-left: 3px;
  }
}

#facilityApprovedProductsModal {
  .rnr-form-error {
    bottom: 25px;
    right: -4%;
  }
  .product-list .rnr-form-error {
    bottom: 18px;
  }
}

#productForm {
  .form-group .form-cell {
    width: 100%;
    .ui-select-width {
      width: 90%;
    }
  }
  .rnr-form-error {
    right: 10px;
  }
  textarea {
    width: 98%;
    height: 50px;
  }
  #productOtherInfoGroup {
    margin-top: 0;
    margin-left: 8px;
    padding: 0 0 16px 0;
    border-top: 0;
  }
  #packsAndCartonGroup {
    margin: 10px 0 5px;
  }
  .short {
    width: 73%;
  }
  .short, .half-width {
    .rnr-form-error {
      right: -15px;
    }
  }
  #productLastUpdated {
    width: 87%;
  }
  #programAssociationTable {
    min-width: 1100px;
    input, select.select2-container {
      margin-bottom: 0;
    }
    input[type="text"] {
      width: 95%;
    }
    .rnr-form-error {
      right: -25px;
      bottom: initial;
      top: -16px;
    }
  }
}

#reportParametersTable {
  width: 1020px;
  .rnr-form-error {
    right: -2%;
  }
}

.unSupportedDataType {
  color: #D31717
}

.action-row {
  td {
    background: #e0e0e0 !important;
  }
}

/* Dashboard EasyChart
=================================================================== */
.easychart {
  position: relative;
  display: inline-block;
  width: 110px;
  height: 110px;
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
}
.easychart canvas {
  position: absolute;
  top: 0;
  left: 0;
}
.easychart-percent {
  display: inline-block;
  line-height: 110px;
  z-index: 2;
}
.easychart-percent:after {
  content: '%';
  margin-left: 0.1em;
  font-size: .8em;
}

.angular-google-map-container { height: 400px; }

.numeric-input{
  text-align:right;
  float:right;
  clear:both;
}

.highlight{
  background-color: #C9DDE1 !important;
}


.search-list {
  position: relative;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin: 10px 0;
  h3 {
    padding: 8px 10px;
    margin: 0;
    background: #f9f9f9; /* Old browsers */
    background: -moz-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #e0e0e0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e0e0e0 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f9f9f9 0%, #e0e0e0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e0e0e0', GradientType=0); /* IE6-9 */
    line-height: normal;
    text-shadow: 0 1px 0 #FFF;
    color: #444;
  }
  .close-btn {
    .square(16px);
    position: absolute;
    top: 10px;
    right: 11px;
    opacity: 0.8;
    background: url(../images/close-icon.png) no-repeat left top;
    text-indent: -999em;
    &:hover {
      opacity: 1;
    }
  }
  ul {
    margin: 0;
    list-style: none;

    li {
      position: relative;
      border-top: 1px solid #CCC;
      &:first-child {
        border-top: 0;
      }
      > a {
        padding: 10px;
        display: block;
        &:hover, &:focus {
          + .search-actions a {
            display: inline-block;
          }
        }
      }
      &:hover > a {
        background-color: #f9f9f9;
      }
      &:hover .search-actions a {
        display: inline-block !important;
      }
    }

    .search-actions {
      position: absolute;
      right: 10px;
      top: 0;
      padding: 6px 0;
      display: inline-block;
      a {
        display: none;
        margin-right: 5px;
      }
    }
  }
}
.vaccine-report {
  .table th, .table td {
    padding: 5px;
    line-height: 15px;
  }
  .accordion {
    .accordion-heading{
      font-size: 1em;
    }
  }
  .red{
    color: red;
  }
  .green{
    color: #008000;
  }
  .blue{
    color: #0000ff;
  }
  .gradient-header th {
    min-width: 0px;
  }
  /*.flot-y-axis > .flot-tick-label{
    left:20px !important;

  }*/
}
.vaccine-report-popover{
  .table th, .table td {
    padding: 4px;
    line-height: 6px;
  }
}

.number, td.number, th.number{
  text-align: right;
}

.text-row, tr.text-row{
  height: 35px;
}